<template>
  <div>
    <SubTitle :name="categoryName" />
    <el-row :gutter="20" justify="center" class="image-row">
      <ProductCard v-for="item in products" :key="item.id" :product="item" />
    </el-row>
  </div>
</template>

<script setup>
import SubTitle from "../components/SubTitle.vue";
import ProductCard from "./ProductCard.vue";

const props = defineProps({
  products: {
    type: Array,
    required: true,
    default: () => []
  },
  categoryName: {
    type: String,
    required: true
  }
})
</script>    

<style scoped>
</style>